<template>
	<view>
		<!-- 头部开始 -->
		<view class="header">
			<view class="title_box">
				<p>会员中心</p>
				<uni-icons @click="$utils.go('/pages/setting/index')" type="gear-filled" size="30" style="margin-top: 110rpx; color: aliceblue; margin-right: 2%;"></uni-icons>
			</view>
			<view class="people">
				<image src="../../static/vip_logo.jpg" mode=""></image>
				<view class="uname">
					<p>13522566762</p>
					<view class="logo">
						<uni-icons type="wallet" size="12" style="color: aliceblue;"></uni-icons>
						<view>已认证</view>
					</view>
				</view>
			</view>
		</view>
		<!-- 头部结束 -->
		
		<!-- 导航开始 -->
		<view class="nav_box">
			<view class="nav" @click="$utils.go('/pages/house/mayhouse')">
				<image src="../../static/vip1.jpg" mode=""></image>
				<p>我的房屋</p>
			</view>
			<view class="nav" @click="$utils.go('/pages/Mycar/Mycars')">
				<image src="../../static/vip2.jpg" mode=""></image>
				<p>我的车辆</p>
			</view>
			<view class="nav" @click="$utils.go('/pages/PayTheFees/PaymentRecords')">
				<image src="../../static/vip3.jpg" mode=""></image>
				<p>我的缴费</p>
			</view>
			<view class="nav" @click="$utils.go('/pages/family_num/family_num')">
				<image src="../../static/vip4.jpg" mode=""></image>
				<p>家庭成员</p>
			</view>
		</view>
		<!-- 导航结束 -->
		
		<!-- 内容开始 -->
		<view class="contentbox">
			<view class="content" @click="$utils.go('/pages/repairs/repairs')">
				<view class="left">
					<uni-icons type="home" size="20"></uni-icons>
					<p>报修记录</p>
				</view>
				<view class="right">
					<uni-icons type="right" size="15" color="#a0a0a0"></uni-icons>
				</view>
			</view>
			<view class="content" @click="$utils.go('/pages/issue/issue')">
				<view class="left" >
					<uni-icons type="calendar" size="20"></uni-icons>
					<p>反馈记录</p>
				</view>
				<view class="right">
					<uni-icons type="right" size="15" color="#a0a0a0"></uni-icons>
				</view>
			</view>
			<view class="content" @click="$utils.go('/pages/help/help')">
				<view class="left">
					<uni-icons type="chat" size="20"></uni-icons>
					<p>联系物业</p>
				</view>
				<view class="right">
					<uni-icons type="right" size="15" color="#a0a0a0"></uni-icons>
				</view>
			</view>
			<view class="content" @click="$utils.go('/pages/amend/personal')">
				<view class="left">
					<uni-icons type="gear" size="20"></uni-icons>
					<p>账号设置</p>
				</view>
				<view class="right">
					<uni-icons type="right" size="15" color="#a0a0a0"></uni-icons>
				</view>
			</view>
		</view>
		<!-- 内容结束 -->
	

	</view>
</template>

<script>
	export default {
		data() {
			return {
			
			};
		}
	}
</script>

<style lang="less">
	page {
		background-color: #f6f6f6;
	}
// 头部开始
.header {
	height: 408rpx;
	background-image: url('../../static/vip.jpg');
	background-size: 100% 100%;
	.title_box {
		display: flex;
		p {
			font-size: 36rpx;
			margin: 0 auto;
			margin-top: 110rpx;
			color: aliceblue;
		}
	}
	.people {
		display: flex;
		image {
			width: 117rpx;
			height: 117rpx;
			margin-left: 46rpx;
		}
		.uname {
			color: aliceblue;
			p {
				margin-top: 19rpx;
				margin-left: 46rpx;
			}
			.logo {
				margin-left: 53rpx;
				margin-top: 16rpx;
				width: 103rpx;
				height: 40rpx;
				border: 1rpx solid aliceblue;
				border-radius: 20rpx;
				display: flex;
				justify-content: center;
				align-items: center;
				font-size: 15rpx;
			}
		}
	}
}
// 头部结束

// 导航开始
.nav_box {
	height: 258rpx;
	background-color: #fff;
	display: flex;
	justify-content: space-around;
	.nav {
		width: 100rpx;
		height: 109rpx;
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
		cursor: pointer;
		image {
			width: 70rpx;
			height: 70rpx;
			margin-top: 77rpx;
		}
		p {
			font-size: 25rpx;
			margin-top: 24rpx;
		}
	}
}
// 导航结束

// 内容开始
.contentbox {
	height: 725rpx;
	background-color: #fff;
	margin-top: 24rpx;
	.content {
		height: 98rpx;
		cursor: pointer;
		border-bottom: 1rpx solid #eeeeee;
		margin: 20rpx;
		display: flex;
		justify-content: space-between;
		align-items: center;
		.left {
			display: flex;
			justify-content: space-between;
			align-items: center;
			p {
				font-size: 26rpx;
				margin-left: 20rpx;
			}
		}
	}
}
// 内容结束
</style>
